import request from '../../utils/request'
let startY = 0; // 手指起始的坐标

let moveY = 0; // 手指移动的坐标

let moveDistance = 0; // 手指移动的距离

// pages/personal/personal.js
Page({
    /**
     * 页面的初始数据
     */
    data: {
        coverTransform: 'translateY(0)',
        coverTranstion: '',
        userInfo: {}, //从本地存储获取的用户信息
        recentPlayList: [] //用户的播放记录
    },

    /**
     * 生命周期函数--监听页面加载
     */
    // 在实例的生命周期函数上最好不要使用async，会导致页面加载出问题。
    onLoad: function(options) {
        // 读取用户的基本信息
        let userInfo = wx.getStorageSync('userInfo');
        if (userInfo) {
            // 更新userInfo的状态
            this.setData({
                // key value 一样，可简写
                userInfo: JSON.parse(userInfo)
            });

            // 获取用户的播放记录
            this.getUserRecentPlayList(this.data.userInfo.userId);
        }
        // console.log(this.data.userInfo);
    },

    // 获取用户播放记录的功能函数
    async getUserRecentPlayList(userId) {
        let recentPlayListData = await request('/user/record', { uid: userId, type: 0 });
        // console.log(recentPlayListData);

        // 由于后台返回的值，没有唯一值作为key，所以要自己加一个唯一的id进去。
        let index = 0;
        let recentPlayList = recentPlayListData.allData.slice(0, 10).map(item => {
            item.id = index++;
            // 这里要返回item，不然得到的是index的数组。
            return item;
        });
        this.setData({
            recentPlayList
        });
        // console.log(this.data.recentPlayList);
    },

    //   手指点击事件
    handleTouchStart(event) {

        // 在再次滑动的时候清空 coverTransform 的值
        this.setData({
            coverTranstion: ''
        })

        //touches是一个数组，一般只取手指第一次摸到屏幕的数据，即touches[0]
        // clientY 事件属性返回当事件被触发时鼠标指针相对于浏览器页面（或客户区）的水平坐标。
        // 客户区指的是当前窗口。
        startY = event.touches[0].clientY;
    },

    // 手指滑动事件
    handleTouchMove(event) {
        moveY = event.touches[0].clientY;
        moveDistance = moveY - startY;

        // 做判断，向上移动时，不移动，向下移动一定值才移动
        if (moveDistance <= 0) {
            return; //直接退出方法，不执行下面的代码
        }
        if (moveDistance >= 80) {
            moveDistance = 80;
        }

        // 动态更新 coverTransform 的状态值
        this.setData({
            coverTransform: `translateY(${moveDistance}rpx)`
        })
    },

    // 手指松开事件
    handleTouchEnd() {
        this.setData({
            coverTransform: 'translateY(0)',
            coverTranstion: 'transform 1s linear'
        })
    },

    // 跳转至登录Login页面的回调
    toLogin() {
        wx.navigateTo({
            // 记得路径前面要加'/'
            url: '/pages/login/login',
        });
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function() {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function() {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function() {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function() {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function() {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function() {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function() {

    }
})